$().ready(function() {

	validateInit();

});

function showMyFormModal() {

	formReset("#myForm");
	$("#myFormModal").modal("show");
}
function saveMyForm() {
	if (!$("#myForm").valid()) {
		return false;
	}
	alert("提交");
}

function validateInit() {
	$("#myForm").validate({
			rules : {
				userId : {
					required : true,
					remote : {
						url : "user/userCheckRepect.action",
						type : "post",
						data : {
							"userId" : function() {
								return $("#myForm [name='userId']").val();
							}
						},
						dataFilter : function(data) {
							return data;
						}
					}
				},
				userName : {
					required : true,
					digits : true
				},
				email : "email"
			},
			messages : {
				userId : {
					required : "用户id不能为空",
					remote : "用户id已经存在"
				},
				userName : {
					required : "用户名不能为空",
					digits : "用户名只能是数字"
				}
			},
			success : function(label, element) {// error是lavel标签，element是input标签
				console.log(label[0]);
				labelReset(element);

				var myTipLabel = '<i class="glyphicon glyphicon-ok form-control-feedback my-tip-i"></i>';
				element.parent().append(myTipLabel);
				element.parent().parent().addClass('has-success');
			},
			errorPlacement : function(label, element) {
				console.log(label[0]);
				labelReset(element);

				var myTipLabel = '<i class="glyphicon glyphicon-remove form-control-feedback my-tip-i"></i>'
								+'<label class="control-label my-tip-label">'
								+	label.text()
								+'</label>';
				element.addClass("error");
				element.parent().append(myTipLabel);
				element.parent().parent().addClass('has-error');
			}
		});
}
/**
 * 带ajax并且自定义成功样式
 */
/*
 * $("#myForm").validate({ rules: { userId: { required: true, remote: { url:
 * "user/userCheckRepect.action", type: "post", data:
 * {"userId":function(){return $("#myForm [name='userId']").val()}}, dataFilter:
 * function(data) { //console.log(data); return data; } } }, userName: {
 * required: true, digits: true }, email: "email" }, messages:{ userId: {
 * required:"用户id不能为空", remote: "用户id已经存在" }, userName: { required: "用户名不能为空",
 * digits: "用户名只能是数字" } }, success: function (label) { labelReset(label);
 * 
 * var myTipLabel = '<label class="control-label my-tip-label">' + '<i
 * class="glyphicon glyphicon-ok"></i> 恭喜您，此用户名可以注册' + '</label>';
 * label.parent().append(myTipLabel);
 * label.parent().parent().addClass('has-success');
 *  } });
 */
/**
 * 带ajax的验证器
 */
/*
 * $("#myForm").validate({ rules: { userId: { required: true, remote: { url:
 * "user/userCheckRepect.action", type: "post", data:
 * {"userId":function(){return $("#myForm [name='userId']").val()}}, dataFilter:
 * function(data) { console.log(data); return data; } } }, userName: { required:
 * true, digits: true }, email: "email" }, messages:{ userId: {
 * required:"用户id不能为空", remote: "用户id已经存在" }, userName: { required: "用户名不能为空",
 * digits: "用户名只能是数字" } } });
 */
/**
 * 默认的验证器
 */
/*
 * $("#myForm").validate({ rules: { userId: "required", userName: { required:
 * true, digits: true }, email: "email" }, messages:{ userId: "用户id不能为空",
 * userName: { required: "用户名不能为空", digits: "用户名只能是数字" } } });
 */
/*
 * $("#myForm").validate({// 创建一个validate对象，可以自己查询使用一些该对象的衍生方法 rules: {
 * userName: { required: true, minlength: 4, maxlength:8 } }, messages: {
 * username: { required: "", minlength: "", maxlength:"" }
 *  }, success: function(e) {//
 * 关键方法，该方法会在validate完成该输入框的判断以后进行一次调用并且会取消默认的显示错误的方法（大概会吧）
 *  // 如果进行调试，会方法输入框的class属性会在根据是否合法改变其样式为 // "error"和"valid"中的一种，通过判断这个进行判断
 * if(e.prev().hasClass("valid")){ //
 * 此处e相当于错误信息这个html标签本身，然后找e的前一个标签是否有"valid"类样式，有则说明当前输入框验证正确
 * e.removeClass("glyphicon-remove");//
 * boostrap的样式，查手册，bootstrap3的全局样式里的表单里有样式说明，添加了对应样式span标签会变为图形。
 * 
 * //比如在引入bootstrap.css的情况下<span class="glyphicon glyphicon-ok
 * form-control-feedback"></span>就是一个打钩的图案 e.addClass("glyphicon-ok"); }
 * if(e.prev().hasClass("error")){ // 判断输入框里有样式"error"则把打叉换成打钩
 * e.removeClass("glyphicon-ok"); e.addClass("glyphicon-remove"); }
 *  }, errorPlacement:function(error,element){ //
 * 决定错误信息要放在哪里的方法，error是label对象，element是当前验证的输入框对象 error.addClass('glyphicon
 * glyphicon-remove form-control-feedback'); error.appendTo(element.parent());
 *  }
 * 
 * });
 */